import { babel, getBabelOutputPlugin } from '@rollup/plugin-babel'
import commonjs from '@rollup/plugin-commonjs'
import { nodeResolve } from '@rollup/plugin-node-resolve'
import replace from '@rollup/plugin-replace'
import clear from 'rollup-plugin-clear'
import terser from '@rollup/plugin-terser'
import alias from '@rollup/plugin-alias'
import htmlTemplate from 'rollup-plugin-generate-html-template'

// 这三个底层依赖postcss
import postcss from 'rollup-plugin-postcss'
// autoprefixer需要配合browserslist
import autoprefixer from 'autoprefixer'
import cssnano from 'cssnano'
// end
// 底层依赖javascript-obfuscator
import { obfuscator } from 'rollup-obfuscator'
// 底层依赖@vue/compiler-sfc
import vue from 'rollup-plugin-vue'
// 开启在线服务(2个插件)
import { liveServer } from 'rollup-plugin-live-server'

import serve from 'rollup-plugin-serve'
import livereload from 'rollup-plugin-livereload'
// 获取package.json的字段
import pkg from './package.json' assert { type: 'json' }
// 解析json文件
import json from '@rollup/plugin-json'
// 解析图片
import img from '@rollup/plugin-image'

import { visualizer } from 'rollup-plugin-visualizer'

import path from 'path'
import { fileURLToPath } from 'url'
const __filename = fileURLToPath(import.meta.url)
const __dirname = path.dirname(__filename)
const pathResolve = (p) => path.resolve(__dirname, p)
const isDev = process.env.NODE_ENV === 'development'


const serveList = isDev ? [
  // 开启在线服务
  // serve({
  //   open: false,
  //   // html的路径
  //   contentBase: 'dist',
  //   // 找不到路径重定向到index.html
  //   historyApiFallback: true,
  //   host: 'localhost',
  //   port: 5555
  // }),
  // livereload()

  liveServer({
    // 热更新的根目录
    root: 'dist',
    host: '0.0.0.0',
    // 端口
    port: 5556,
    // 是否在浏览器中打开
    open: false,
    // file: 'index.html',
    wait: 500
  })
] : []

export const devPlugins = [
  // 清除打包目录
  clear({
    // 要清除的文件
    targets: ['dist'],
    // 配合rollup --watch 监听模式
    watch: true
  }),
  // 解析vue文件
  vue(),
  // 允许加载 node_modules 中的第三方模块(将第三方模块打包)
  // 支持解析 node.js 内置模块
  nodeResolve({
    browser: true,
    preferBuiltins: true,
    moduleDirectories: ['node_modules']
  }),
  json(),
  img({
    // dom: true,
    include: 'src/**',
    exclude: 'node_modules/**',
  }),
  // 将外部依赖commonjs模块解析成es模块
  commonjs({
    include: ['node_modules/**']
  }),

  // @babel/core @babel/preset-env @babel/plugin-transform-runtime 
  // @babel/runtime @babel/runtime-corejs3 @rollup/plugin-babel
  // 将 ES6 代码转换为 ES5
  babel({
    include: 'src/**',
    extensions: ['.js'],
    // exclude: 'node_modules/**',
    babelHelpers: 'runtime'
  }),
  // getBabelOutputPlugin({
  //   presets: ['@babel/preset-env'],
  //   allowAllFormats: true
  // }),

  // 处理css
  postcss({
    // 抽离成单独的文件
    extract: true,
    plugins: [
      autoprefixer(),
      // 压缩css
      cssnano()
    ]
  }),

  // 设置资源别名与格式识别
  alias({
    resolve: ['.js', '.ts'],
    entries: [
      // '@': pathResolve('src'),
      // 或者
      { find: '@', replacement: pathResolve('src') }
    ]
  }),

  // 替换打包内的内容(将a替换为b)
  replace({
    preventAssignment: true,
    'process.env.NODE_ENV': JSON.stringify(isDev ? 'development' : 'production')
  }),

  // 设置html注入模板
  htmlTemplate({
    template: './index.html',
    target: 'dist/index.html',
    // 配置额外的属性
    attrs: ['defer', "type='module'"],
    // 设置资源的公共前缀/地址
    replaceVars: {
      '__CDN_URL__': isDev ? '' : '/dist/'
    }
  }),
  ...serveList
]

export const prodPlugins = [
  terser(),
  // 加密混淆
  obfuscator({
    compact: true,
    identifierNamesGenerator: 'hexadecimal',
    log: false,
    stringArray: true,
    stringArrayEncoding: ['rc4'],
    stringArrayThreshold: 1,
    transformObjectKeys: true,
    target: 'browser'
  }),
  // 可视化分析打包结果
  visualizer({
    open: true
  })
]

export const mergePlugins = [
  ...devPlugins,
  ...prodPlugins
]